<template>
  <view>
       <uni-nav-bar title="访客照片" background-color="#007AFF" color="#fff"/>
    <!-- 展示图片信息模板 -->
      <view class="backQRerweim">
       <view class="text-box">
        <view class="text-title">登记信息提交成功</view>
        <view>欢迎您的来访</view>
       </view>
        <view class="backnavigator">
          <navigator :url="'/pages/home/home'" class="backnavigator_title">返回二维码</navigator>
        </view>
      </view>
    <!-- 弹框组件 -->
    <uni-popup ref="alertDialog" type="dialog">
      <uni-popup-dialog :type="msgType" cancelText="关闭" confirmText="确定" title="来访允许通过" content="欢迎来访"
        @close="dialogClose">
        </uni-popup-dialog>
    </uni-popup>
  </view>
</template>

<script>
  export default {
    data() {
      return {
        msgType: 'success',
        // 存储图片信息
        personphoto:''
      };
    },
    onLoad(options) {

      this.dialogToggle()
    },
    methods: {
      // 来访弹框提示
      dialogToggle(type) {
        this.msgType = type
        this.$refs.alertDialog.open()
      },
    }
  }
</script>

<style lang="scss">
  .uni-dialog-button:first-child {
    display: none;
  }
  .backQRerweim {
    margin-top: 80px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
  }
  .text-box {
           border: 2px solid #e5e5e5;
           width: 300px;
           height: 160px;
           border-radius: 10px;
           display: flex;
           justify-content: center;
           align-items: center;
           flex-direction: column;
  }
  .text-title {
    margin-bottom: 20px;
        color: #4cd964;
  }
  .backnavigator {
    margin: 50px 80px 0;
    height: 35px;
    line-height: 35px;
    width: 100px;
    background-color: #8ea711;
    color: #fff;
    border-radius: 10px;
  }
  .backnavigator_title {
    text-align: center;
    font-size: 20px;

  }

</style>